import React, { Component } from 'react';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { Card, Col, Row, Steps } from 'antd';
import CategoryTree from '@/pages/item/category/components/CategoryTree';
import EditForm from '@/pages/item/publishProduct/components/EditForm';

const { Step } = Steps;
/**
 * 发布商品
 */
class PublishItem extends Component {
  state = {};

  render() {
    return (
      <PageHeaderWrapper
        content={
          <Steps>
            <Step title="选择产品分类" description="选择产品分类" status="process" />
            <Step title="提交产品" description="填写产品信息并提交" status="process" />
            <Step title="审核" description="等待审核通过" status="process" />
            <Step title="上架" description="在产品列表中选择产品进行上架" status="process" />
          </Steps>
        }
      >
        <Card bordered={false}>
          <Row gutter={24}>
            <Col sm={6} xs={24} style={{ background: '#fafafa', padding: 5 }}>
              <CategoryTree />
            </Col>
            <Col sm={18} xs={24}>
              <EditForm />
            </Col>
          </Row>
        </Card>
      </PageHeaderWrapper>
    );
  }
}

export default PublishItem;
